// 引入进度条/样式
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
// 引入router
import router, { asyncRoutes } from '@/router'

// 引入 Vuex
import store from '@/store'

// 定义白名单
const whileList = ['/login', '/404']
import getPageTitle from '@/utils/get-page-title'

// 前置导航守卫
// to : 去哪  from : 从哪来  next : 放行?
// NProgress.start()  显示进度条
// NProgress.done()  隐藏进度条
router.beforeEach(async(to, from, next) => {
  document.title = getPageTitle(to.meta.title)
  // 显示进度条
  NProgress.start()
  // 获取token
  const token = store.state.user.token

  // 判断token是否存在
  if (token) {
    // 判断访问是否是登录页 是:跳转主页 否:放行

    if (to.path === '/login') {
      next('/')
      NProgress.done()
    } else {
      // 获取用户信息
      // 需要有token, 并且在token之前
      // await store.dispatch('user/getUserInfo')

      // 先判断有没有用户信息(第一次访问时 已经存到Vuex)
      // 没有用户信息 需要获取用户信息 存到Vuex
      // console.log(store.getters)
      if (!store.getters.userId) {
        const menus = await store.dispatch('user/getUserInfo')
        // 如果存在 token，访问的是其他页面，直接放行
        const filterRoutes = asyncRoutes.filter(item => {
          const routeName = item.children[0].name

          return menus.includes(routeName)
        })

        filterRoutes.push(
          { path: '*', redirect: '/404', hidden: true }
        )
        // console.log(filterRoutes)
        // await store.dispatch('user/getUserInfo')
        router.addRoutes(filterRoutes)

        // 将动态路由传递给 mutation 方法,进行合并
        store.commit('permission/setRoutes', filterRoutes)

        next({
          path: to.path // 保证路由添加完了再进入页面 (可以理解为重进一次)
        })
      }
      next()
      NProgress.done()
    }
  } else {
    // 判断访问的路径是否在白名单 是:放行 否:跳转登录页
    // includes 数组中是否包含 返回bool值
    if (whileList.includes(to.path)) {
      next()
    } else {
      next('/login')
      NProgress.done()
    }
  }
})

// 后置守卫
router.afterEach((to, form) => {
  // 隐藏进度条
  NProgress.done()
})
